<template>
  <view class="user-detail">
    <cu-custom bgColor="bg-gradual-blue" :isBack="true">
      <block slot="backText" @click="backChat">返回列表</block>
      <block slot="content">好友信息</block>
    </cu-custom>
    <view class="main">
      <view class="info">
        <view class="avatar">
          <view
            class="cu-avatar radius"
            style="
              background-image: url(https://ossweb-img.qq.com/images/lol/web201310/skin/big107000.jpg);
              width: 100rpx;
              height: 100rpx;
            "
          ></view>
        </view>
        <view>
          <text class="txt" style="font-weight: 700">这是一条备注</text>
          <text class="txt">名字: 张三（女）</text>
          <text class="txt">账号: 110</text>
        </view>
      </view>
      <view class="introduction" style="width: 80%; margin: 10px auto">
        <text class="text-center text-grey"
          >简介：这里是好友的简介这里是好友的简介这里是好友的简介这里是好友的简介这里是好友的简介这里是好友的简介</text
        >
      </view>
      <view class="action">
        <button class="cu-btn block bg-blue margin-tb-sm lg">添加好友</button>
        <button class="cu-btn block line-orange lg">添加备注</button>
        <button class="cu-btn block line-orange lg">发送消息</button>
        <button class="cu-btn bg-red margin-tb-sm lg" style="width: 100%">
          删除好友
        </button>
      </view>
    </view>
    <newMessage ref="newMessage"></newMessage>
  </view>
</template>

<script>
	import newMessage from '../../asstess/newMessage/newMessage'
	export default {
		data() {
			return {

			}
		},
		onLoad() {
			// 获取本地存储内数据
		    let data  = sessionStorage.getItem('userData')
		    this.userData = JSON.parse(data)
            // 新消息弹框
            let newChatAlert = (data) =>{
                console.log('第一个新消息回调',data);
                if (data.head.fromMemberId !== this.userData.member_id) {
                    uni.pageScrollTo({
                        scrollTop: 99999999999,
                        duration: 10,
                    })
                this.talkData = this.$Socket.getChat(this.$route.query.id).data;  
                console.log('聊天记录新',this.talkData)
                }
            }
			let listRefresh = (data) =>{
                console.log(data,'列表刷新')
			}
			let talkDetailRefresh = (data) =>{
                console.log(data,'会话详情刷新')
            }
            let TalkWithMsg = (msg) => {
                console.log('msg',msg)
            }
			this.$Socket.addTalkObjectCallback(
				newChatAlert,
				listRefresh,
                talkDetailRefresh,
                TalkWithMsg
            );
		},
		methods:{
			backChat(){
				uni.navigateTo({ url: "pages/component/chat" });
			}
		},
		components: {
			newMessage
		},
	}
</script>

<style scoped lang='less'>
.user-detail .main {
  padding: 25px;
}
.user-detail .main {
  padding: 25px;
}
.info {
  display: flex;
}
.info .avatar {
  width: 30%;
  text-align: center;
}
.txt {
  display: inline-block;
  width: 100%;
}
.action {
  margin-top: 20px;
}
button {
  margin-top: 10px;
}
</style>
